﻿@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>客户登录</title>
    <link rel="stylesheet" href="~/conjs/global.css" />
    <link href="~/conjs/cityLayout.css" type="text/css" rel="stylesheet">
    <link rel="stylesheet" href="~/conjs/Site.css" />
    <style>
        body {
            font-family: 'Segoe UI', system-ui, sans-serif;
            margin: 0;
            padding: 0;
            /*background-color: #e0f7fa;*/ /* PaleTurquoise */
            background-image: url("/img/5.png");
            background-size: cover;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }
        /* 登录表单样式 */
        .login-form {
            background: white;
            padding: 2rem;
            border-radius: 10px;
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
            width: 300px;
        }

            .login-form h2 {
                margin-bottom: 1rem;
                color: #0d47a1; /* DeepPurple */
            }

            .login-form input[type="text"],
            .login-form input[type="password"] {
                width: 100%;
                padding: 0.5rem;
                margin: 0.5rem 0;
                border: 1px solid #b0bec5; /* BlueGrey */
                border-radius: 5px;
            }

            .login-form input[type="submit"] {
                width: 100%;
                padding: 0.5rem;
                margin-top: 1rem;
                border: none;
                border-radius: 5px;
                background-color: #0288d1; /* Blue */
                color: white;
                cursor: pointer;
                transition: all 0.3s ease;
            }

        .er {
            width: 100%;
            padding: 0.5rem;
            margin-top: 1rem;
            border: none;
            border-radius: 5px;
            background-color: #0288d1;
            color: white;
            cursor: pointer;
            transition: all 0.3s ease;
        }
                .login-form input[type="submit"]:hover {
                    background-color: #0277bd;
                }

            .login-form .social-icons {
                display: flex;
                justify-content: space-between;
                margin: 1rem 0;
            }

                .login-form .social-icons img {
                    width: 24px;
                    height: 24px;
                    cursor: pointer;
                }

            .login-form .register-link {
                text-align: center;
                margin-top: 1rem;
            }

                .login-form .register-link a {
                    color: #0288d1; /* Blue */
                    text-decoration: none;
                }

                    .login-form .register-link a:hover {
                        text-decoration: underline;
                    }
    </style>
</head>
<body>
    <div id="all">
        <div id="content">
            <!--页面内容部分-->
            <div class="jumbotron">
                <h2>网上书城</h2>
                <div class="account">
                    <table>
    <tr>
        <td>
            <div class="login-form">

                <form method="post">
                    <h2>登录</h2>
                    <p>输入账号密码</p>
                    <input type="text" name="ShopLogin" placeholder="User Name" autocomplete="off" />
                    <input type="password" name="ShopPassword" placeholder="User Password" autocomplete="off" />
                    <span class="error-message">@ViewBag.LoginError</span>
                    <span class="error-message">@ViewBag.PasswordError</span>
                    <input type="submit" value="登录" />
                    <div class="register-link">

                        您还没有账号?   @Html.ActionLink("注册", "AddRegister", "ShopInfo")
                    </div>
                </form>
            </div>
        </td>
        <td>
            <div style="margin-left:50px">
                <img src="/img/2.png" alt="Alternate Text" style="width:200px; height: 200px" />
                <div class="er">
                    <span style="margin-left:80px"></span>
                    @Html.ActionLink("退出", "Index", "ShopInfo", null, new { @class = "action-btn", style = "color:white;" })
                </div> 
            </div>
        </td>
    </tr>
</table>
                       
                   
                    
                </div>
            </div>
        </div>
    </div>

    <script type="text/javascript" src="~/conjs/bootstrap.js"></script>
    <script type="text/javascript" src="~/conjs/jquery-3.3.1.js"></script>
    <script type="text/javascript" src="~/conjs/jquery-3.4.1.js"></script>
</body>
</html>